// 引入 react 依赖
import React, { Component } from 'react';
import { connect } from 'react-redux';
import { Text, View, Image, TouchableOpacity, ImageBackground, ScrollView, InteractionManager } from 'react-native';

// 引入第三方依赖
import _ from 'lodash';
import pureRender from 'pure-render-decorator';
import { Actions } from 'react-native-router-flux';
import Icon from 'react-native-vector-icons/Ionicons';
import * as ActionTypes from '../../constants/constants.js';

// antd 按需加载
import { Tabs, Toast, Portal, List, Switch, Checkbox, WhiteSpace } from '@ant-design/react-native';
const Item = List.Item;
const Brief = Item.Brief;

// 引入 处理数据 所需文件
import { } from '../../module/module.js'

// 引入样式
import Style from './style/style.js';

// 引入公用组件
import { Status, NavBar, CacheImage, CacheHelper } from '../../components/index.js'

// 引入专用组件
import { } from './components'

// 引入工具包
import { } from '../../util/images.js';
import { press, size, ScreenWidth, removeData, pathHead, borderBottom, hotTextColor, defaultDataList, onEndReached, onRefresh, concatDataList, defaultPage } from '../../util/utils.js'


class Setting extends Component {

  constructor(props) {
    super(props)
    this.state = {
      cacheSize: '',

    }
  }

  componentDidMount() {
    // this.getCacheSizeFormat();
  }

  // getCacheSizeFormat() {
  //   CacheHelper.getCacheSizeFormat().then(res => {
  //     this.setState({
  //       cacheSize: res,
  //     });
  //   });
  // }

  // imageClear() {
  //   CacheHelper.clearCache().then(res => {
  //     this.getCacheSizeFormat();
  //     Toast.success('清除成功');
  //   });
  // }

  logout() {
    const { dispatch } = this.props
    dispatch({
      type: ActionTypes.clearToken,
    })
    dispatch({
      type: ActionTypes.clearUserInfo,
    })
    dispatch({
      type: ActionTypes.clearLoginInfo,
    })
    removeData('token');
    removeData('loginInfo');
    removeData('userInfo');
    Toast.info('退出登录', 1);
    Actions.login();
  }

  render() {
    const { cacheSize } = this.state;
    const { user } = this.props
    return (
      <View style={Style.container}>
        <Status />
        <NavBar
          title="个人中心"
          back={true}
        />
        <ScrollView style={Style.content}>
          <List>
            <Item
              extra={'我的资料'}
              arrow="horizontal"
              onPress={() => {
                Actions.setUserInfo()
              }}
            >
              <CacheImage
                resizeMod={"contain"}
                style={{
                  width: 30,
                  height: 30,
                  borderRadius: 15,
                  overflow: 'hidden',
                }}
                source={{ uri: `${pathHead}${user.avatar}` }}
              />
            </Item>
            <Item
              extra={'修改密码'}
              arrow="horizontal"
              onPress={() => {
                Actions.changePassword()
              }}
            >
              <Text style={{ fontSize: 14, color: '#999', lineHeight: 30 }}>登录密码</Text>
            </Item>
          </List>
          <View style={{
            padding: 15,
            alignItems: 'center',
          }}>
            <TouchableOpacity
              onPress={() => {
                Actions.privacyTerms()
              }}
            >
              <Text style={{ fontSize: 14, color: '#000', lineHeight: 16, }}>《用户协议》《隐私条款》</Text>
            </TouchableOpacity>
          </View>
          <View style={{ padding: 15, }}>
            <TouchableOpacity
              onPress={() => {
                this.logout()
              }}
              style={{
                paddingVertical: 14,
                paddingHorizontal: 20,
                backgroundColor: hotTextColor,
                borderRadius: 6,
                alignItems: 'center',
                justifyContent: 'center',
              }}
            >
              <Text style={{ fontSize: size(28), color: '#fff', lineHeight: size(30), }}>退出登录</Text>
            </TouchableOpacity>
          </View>
        </ScrollView>
      </View >
    );
  }
}


export default connect(({ user, userInfo }) => ({
  user, userInfo
}))(pureRender(Setting))
